<template>
	<mu-container>
	  <mu-tabs :value.sync="active1" inverse color="secondary" text-color="rgba(0, 0, 0, .54)"  center>
	    <mu-tab>待办</mu-tab>
	    <mu-tab>账本</mu-tab>
	    <mu-tab>树洞</mu-tab>
		<mu-tab @click="getMyDiary">日记</mu-tab>
	  </mu-tabs>
	  <div class="demo-text" v-if="active1 === 0">
	    <mu-expand-transition>
	        <template>
	        	<kapian></kapian>
	        </template>
	      </mu-expand-transition>
		
	  </div>
	  <div class="demo-text" v-if="active1 === 1">
	  <mu-expand-transition>
	      <template>
			<Account></Account>
	      </template>
	   </mu-expand-transition>
	  </div>
	  <div class="demo-text" v-if="active1 === 2">
	  <mu-expand-transition>
	      <template>
	  			<TreeHole></TreeHole>
	      </template>
	   </mu-expand-transition>
	  </div>
	  <div class="demo-text" v-if="active1 === 3">
	  <mu-expand-transition>
	      <template>
	  			<TimeCard></TimeCard>
	      </template>  
	   </mu-expand-transition>
	   
	   <mu-expand-transition>
	       <template>
	   			 <messageCard></messageCard>
	       </template>  
	    </mu-expand-transition>
	  
	  </div>
	</mu-container>
</template>
<script>
import kapian from './kapian.vue'
import Account from './Account.vue'
import TimeCard from './TimeCard.vue'
import TreeHole from './TreeHole.vue'
import messageCard from './messageCard.vue'
import {
		mapState,
		mapMutations
	} from 'vuex'
export default {
	computed:{
		...mapState(['Dliary'])
	},
  data () {
    return {
      active1: 0
    };
  },
  components:{
  	kapian,
	Account,
	TimeCard,
	TreeHole,
	messageCard
  },
  methods:{
	async  getMyDiary(){
		  const userInfo=uni.getStorageSync('userInfo');
		await this.$api({url:'/add/mydiary?id='+userInfo.id},{}).then(res=>{
			 console.log(res.data.data);
			 this.$store.commit('setDliary',res.data.data);
			 console.log(this.Dliary);
		  })
	  }
  }
}
</script>
<style lang="less">
.demo-text {
  padding: 16px;
  background: #fff;
  p {
    margin: 8px 0;
  }
}
</style>